#account-table
	table.table.table-striped.table-bordered(data-bind="foreach:accounts")
		tr(data-bind="attr:{id:'tr'+id}")
			td
				img.img-thumbnail.pull-left(data-bind="attr:{src:utils.headimg(username+'.jpg'),id:'img'+id}",style="width:75px;")
				span
					strong(data-bind="text:nickname")
					|&nbsp;&nbsp;
					span(data-bind="text:alias")
					|&nbsp;
					|(
					span(data-bind="text:approved_count")
					|/
					span(data-bind="text:article_count")
					|)
					a(data-bind="attr:{href:'history/'+uin}",target="_blank") 历史推送
					.col-sm-offset-1.btn-group.btn-group-xs.pull-right
						button.btn.btn-xs.btn-primary(data-bind="click:$root.updateAccount.bind($context,id,username)") 更新
						button.btn.btn-xs(data-bind="click:$root.activeAccount.bind($context,id,active),css:{'btn-warning':active==0,'btn-success':active>0},text:(active?'启用':'禁用')")
						button.btn.btn-xs.btn-danger(data-bind="click:$root.deleteAccount.bind($context,id)") 删除

					select.pull-right(data-bind="value:category")
							option 
							option 科技
							option 财经
							option 娱乐
							option 生活
							option 情感
							option 时政
							option 人文
							option 时尚
							option 吃货
							option 无节操
						
					br
					small(data-bind="text:signature")

	ul.pagination(data-bind="foreach:pages")
		li(data-bind="css:{active:$root.page()==$data}")
			a(href="#",data-bind="click:function(){$root.paginate($data)},text:$data+1")

script
	var AccountVM = function(){
		var self = this;
		self.accounts = ko.observableArray([]);
		self.pages = ko.observableArray([]);
		self.page = ko.observable(0);
		self.count = ko.observable(0);
		self.fetch = function(){
			$('#loading').modal('show')
			$.ajax({
					url:'accounts?page='+self.page(),
					success:function(data){
						self.count(data.count);
						self.pages(ko.utils.range(0,Math.ceil(data.count/200)));
						self.accounts(data.accounts);
						$('#loading').modal('hide');
					}
				})
		}
		self.updateAccount = function(id,username){
			$.ajax({
				url:'accounts/'+id+'/update',
				type:'post',
				data:{category:$('#tr'+id+' select').val()},
				success:function(){
					$('#img'+id).attr('src',utils.headimg(username+'.jpg?_v='+ new Date().getTime()) );
				}
			})
		}

		self.paginate = function(page){
			self.page(page);
			self.fetch();
		}

		self.deleteAccount = function(id){
			$.ajax({
				url:'accounts/'+id+'/delete',
				success:function(){
					$('#tr'+id).hide();
					$('#loading').modal('hide');
				}	
			});
		}

		self.activeAccount = function(id,active){
			$.ajax({
				url:'accounts/'+id+'/active?active='+active,
				success:function(){
					self.fetch();
				}
			})
		}
	}
	window.accountVM = new AccountVM();
	accountVM.fetch()
	ko.applyBindings(accountVM,document.getElementById('account-table'));